// JavaScript Document
KuoqiAppjs.define('Kuoqi.app.canvas',{
	version:'base',
	extends:'Kuoqi.app',
	//__toModule:function(){},
	zIndex:1,//
	width:0,//当前画布的宽度
	height:0,//当前画布的高度
	childs:[],//元素盒子列表
	config:{},
	//基础的盒子元素
	boxElement:null,
	//元素信息
	element:document.createElement("canvas"),
	
	//本元素的画布
	canvas:null,
	
	//初始化方法
	init:function(callback){callback();},
	
	//增加元素列表，当然这些所谓的元素都是在这个列表中的部分
	append:function(kele){
		//判定自己是否拥有数据自己的childs,如果没有则自己创建一个属于自己的孩子列表
		if(!Object.prototype.hasOwnProperty.call(this,'childs')){
			this.childs = [];	
		}
		this.childs.push(kele);
		//将元素的信息，渲染到画布上面
		kele.flushIn(this);
	},
	
	flushIn:function(box){
		//todo--
		$Q.error('调用flushIn方法，把本对象的信息，渲染到上级的canvas中');
	},
	
	//进入下一帧
	nextFrame:function(){
		//todo--当执行一些动画效果的时候，会用到这个，会根据计算，然后得出下一帧的样子	
		//子方法使用同样的函数进入到下一帧的计算中
		//console.log(this);
		//将所有的孩子都写到这里面
		//重置所有的内容区域
		if(this.canvas){
			this.canvas.clearRect(0,0,this.width,this.height);
		}
		
		this.childs.forEach(function(child){
			child.nextFrame();
		});
	},
	
	//因为一些常用元素变更导致的重建
	sync:function(){
		this.review();
	},
	
	//保存为图片信息
	saveAsJpeg:function(fn){
		var filename = fn + '.jpg';
		var source =this.element.toDataURL('image/jpeg');
		var dom = $Q('<a download="'+filename+'" href="'+source+'"></a>');
		$Q('body').append(dom);
		dom.click();
		dom.remove();
	},
	
	//根据配置文件创建一个canvas信息
	createByconfig:function(config){
		this.config = config;
		this.config.element = this.element;
		this.config.canvas = this.element.getContext("2d");
		this.config.boxElement = this.boxElement;
		config.review();//重现代码块内容
	},
	
	//创建基础的画布信息

	create:function(){
		this.element.width = this.width;
		this.element.height = this.height;
		if(this.boxElement){
			this.boxElement.appendChild(this.element);
		}
		this.canvas = this.element.getContext("2d");
	},
});
